<template>
	<view class="wrap">
		<u-navbar title="设置"></u-navbar>

		<!-- 验证开关 -->
		<view class="group u-border-bottom u-m-t-20">
			<view class="label u-font-28">
				<u-icon name="checkmark" size="32" color="#555"></u-icon>
				<text style="margin-left: 16rpx;">加我好友时需要验证</text>
			</view>
			<u-switch :value="isAddValidate" size="30" @change="onFriendVerifyChange"></u-switch>
		</view>

		<!-- 搜索开关 -->
		<view class="group u-border-bottom">
			<view class="label u-font-28">
				<u-icon name="search" size="32" color="#555"></u-icon>
				<text style="margin-left: 16rpx;">允许别人搜索到我</text>
			</view>
			<u-switch :value="isSearch" size="30" @change="onCanSearchChange"></u-switch>
		</view>
		<u-gap height="20" bg-color="#F5F5F5"></u-gap>


		<!-- 字体设置 -->
		<view class="group u-border-bottom" @click="settingFont">
			<view class="label u-font-28">
				<!-- <u-icon name="font" size="32" color="#555"></u-icon> -->
				<image src="@/static/images/setting/pie11.png" mode="widthFix" style="width: 32rpx;"></image>
				<text style="margin-left: 16rpx;">字体大小</text>
			</view>
			<view class="arrow">
				<u-icon size="28" color="#999" name="arrow-right"></u-icon>
			</view>
		</view>
<u-gap height="20" bg-color="#F5F5F5"></u-gap>

		<!-- 修改密码 -->
		<navigator url="/pages/my/archive/password" hover-class="none" class="group u-border-bottom">
			<view class="label u-font-28">
				<u-icon name="lock" size="32" color="#555"></u-icon>
				<text style="margin-left: 16rpx;">修改登录密码</text>
			</view>
			<view class="arrow">
				<u-icon size="28" color="#999" name="arrow-right"></u-icon>
			</view>
		</navigator>

		<!-- 注销账号 -->
		<view class="group u-border-bottom" @click="destroy">
			<view class="label u-font-28">
				<u-icon name="close" size="32" color="#555"></u-icon>
				<text style="margin-left: 16rpx;">注销账号</text>
			</view>
			<view class="arrow">
				<u-icon size="28" color="#999" name="arrow-right"></u-icon>
			</view>
		</view>
		<u-gap height="20" bg-color="#F5F5F5"></u-gap>


<!-- 举报投诉 -->
		<navigator url="/pages/complain/index" hover-class="none" class="group u-border-bottom">
			<view class="label u-font-28">
				<u-icon name="chat" size="32" color="#555"></u-icon>
				<text style="margin-left: 16rpx;">举报投诉</text>
			</view>
			<view class="arrow">
				<u-icon size="28" color="#999" name="arrow-right"></u-icon>
			</view>
		</navigator>
		<!-- 关于我们 -->
		<navigator url="/pages/about/about" hover-class="none" class="group u-border-bottom">
			<view class="label u-font-28">
				<u-icon name="info-circle" size="32" color="#555"></u-icon>
				<text style="margin-left: 16rpx;">关于我们</text>
			</view>
			<view class="arrow">
				<u-icon size="28" color="#999" name="arrow-right"></u-icon>
			</view>
		</navigator>

		<view url="" hover-class="none" class="group u-border-bottom" @click="share(data.dictValue)">
			<view class="label u-font-28">
			<u-icon name="share" size="32" color="#555"></u-icon>
				<text style="margin-left: 16rpx;">{{data.dictLabel}}</text>
			</view>
			<view class="arrow">
				<u-icon size="28" color="#999" name="arrow-right"></u-icon>
			</view>
		</view>
		

		<!-- 退出登录 -->
	<view class="group u-row-center u-m-t-20" @tap="logoutP">
				<text class="u-font-30">退出当前登录</text>
			</view>

		<!-- 弹窗 -->
		<u-modal v-model="ask.show" :content="ask.content" @confirm="resolve" @cancel="reject"
			:cancel-text="ask.cancel" :confirm-color="ask.confirmColor" :confirm-text="ask.confirm"
			:mask-close-able="ask.maskClose" :show-title="false" show-cancel-button>
		</u-modal>
	</view>
</template>

<script>
	import {mapGetters,mapActions,mapMutations} from "vuex"
	import {toast,delay} from "@/utils/util.js"
	import { setIsAddValidate, setIsSearch } from "@/api/user";
	import {getDict} from "@/api/system.js"
	export default {
		data() {
			return {
				ask:{
					show:false,
					content:'确认退出吗?',
					confirm:'确认',
					confirmColor:'#FF0000',
					cancel:'点错了',
					maskClose:true
				},
				data:[],
				bridge:null,
				lock:false
			};
		},
		
		async	mounted(){
					// getDict('cat_show_withdrawal_method').then((list)=>{
						const res=await 	getDict('share');
						this.data=res[0];
						console.log(this.data)
					// }
			},
		
		computed:{
			...mapGetters('user',['userInfo']),
			isAddValidate(){
				return this.userInfo&&this.userInfo.userExt&&this.userInfo.userExt.isAddValidate=='1'
			},
			isSearch(){
				return this.userInfo&&this.userInfo.userExt&&this.userInfo.userExt.isSearch=='1'
			}
		},
		methods:{
			...mapMutations('user',['mixUserInfo']),
			...mapActions('user',['logout']),
			reject(e){
				this.bridge&&this.bridge.reject&&this.bridge.reject(e)
			},
			resolve(e){
				this.bridge&&this.bridge.resolve&&this.bridge.resolve(e)
			},
	share(url) {
	  uni.setClipboardData({
	    data: url,
	    success: () => {
	      uni.showToast({ title: '已复制' })
	    },
	    fail: () => {
	      uni.showToast({ title: '复制失败', icon: 'none' })
	    }
	  })
	},
			async destroy(){
	uni.navigateTo({
					url:'/pages/login/logout'
				})
				// await new Promise((resolve,reject)=>{
		
				// uni.showLoading({
				// 	title:'loading...'
				// })
				// await delay(3000)
				// uni.hideLoading()
				// uni.showToast({
				// 	title:'申请注销成功，7个工作日内会完成注销您的账号！',
				// 	icon:'success'
				// })
			},
			
			settingFont(){
				console.log(44)
				uni.navigateTo({
					url:'/pages/my/fontsize'
				})
			},
async logoutP() {
  try {
    await new Promise((resolve, reject) => {
      this.ask.show = true
      this.bridge = { resolve, reject }
    })
    await this.logout()
    toast('登出成功')
    await delay(1000)
    uni.reLaunch({
      url:'/pages/login/login'
    })
  } catch (e) {
    console.error('登出失败：', e)
    toast(e.message || '登出失败，请重试')
    this.ask.show = false
  }
},
			async onFriendVerifyChange(){
				if(this.lock){
					return
				}
				try{
					this.lock = true
					const res = await setIsAddValidate(this.isAddValidate?0:1)
					if(res){
						this.mixUserInfo({
							userExt:{
								...this.userInfo.userExt,
								isAddValidate:this.isAddValidate?'0':'1'
							}
						})
					}
				}finally{
					this.lock = false
				}
			},
			async onCanSearchChange(){
				if(this.lock){
					return
				}
				try{
					this.lock = true
					const res = await setIsSearch(this.isSearch?0:1)
					if(res){
						this.mixUserInfo({
							userExt:{
								...this.userInfo.userExt,
								isSearch:this.isSearch?'0':'1'
							}
						})
					}
				}finally{
					this.lock = false
				}
			}
		}
	}
</script>
<style>
	page{
		background-color: #F5F5F5;
	}
</style>
<style lang="scss">
	.wrap{
		display: flex;
		flex-direction: column;
	}
	.group{
		display: flex;
		align-items: center;
		padding: 30rpx;
		background-color: #FFFFFF;
		.label{
			flex: 1;
		}
		.arrow{
			margin-left: 10rpx;
		}
	}
</style>
